/*该文件用于创建Vuex最核心的store*/

// 引入Vue
import Vue from "vue";

// 引入Vuex
import Vuex from "vuex";

// 使用Vuex插件
Vue.use(Vuex)

//定义一个actions--用于响应组件中的动作
const actions = {
    /*因为组件里面调用了this.$store.dispatch("类型", "值")，类型和这个函数名一致所以联系到了这个actions里的函数
    这个actions里的函数接受两个参数：context：上下文，value：dispatch传递过来的值*/
    increment(context, value) {
        // actions里面的函数提交commit调用context.commit("类型","值")
        context.commit("ICCREMENT", value)
    },
    /*因为组件里面调用了this.$store.dispatch("类型", "值")，类型和这个函数名一致所以联系到了这个actions里的函数
  这个actions里的函数接受两个参数：context：上下文，value：dispatch传递过来的值*/
    decrement(context, value) {
        // actions里面的函数提交commit调用context.commit("类型","值")

        context.commit("DECREMENT", value)
    },
    /*因为组件里面调用了this.$store.dispatch("类型", "值")，类型和这个函数名一致所以联系到了这个actions里的函数
  这个actions里的函数接受两个参数：context：上下文，value：dispatch传递过来的值*/
    incrementOdd(context, value) {
        if (context.state.sum % 2 !== 0) {
            // actions里面的函数提交commit调用context.commit("类型","值")

            context.commit("ICCREMENT", value)
        }
    },
    /*因为组件里面调用了this.$store.dispatch("类型", "值")，类型和这个函数名一致所以联系到了这个actions里的函数
  这个actions里的函数接受两个参数：context：上下文，value：dispatch传递过来的值*/
    incrementWait(context, value) {
        setTimeout(() => {
            // actions里面的函数提交commit调用context.commit("类型","值")
            context.commit("ICCREMENT", value)
        }, 3000)
    }
}

//定义一个mutations--用于操作state中的数据
const mutations = {
    /*因为actions里面的函数调用了context.commit("类型","值")，其中commit("类型","值")
    其中第一个参数和mutations里面的函数对应上了所以执行对应函数*/
    ICCREMENT(state, value) {
        // mutations里面的函数接受两个参数 state:数据，value：actions里的函数调用commit("类型","值")传递过来的值
        state.sum += value
    },
    /*因为actions里面的函数调用了context.commit("类型","值")，其中commit("类型","值")
   其中第一个参数和mutations里面的函数对应上了所以执行对应函数*/
    DECREMENT(state, value) {
        // mutations里面的函数接受两个参数 state:数据，value：actions里的函数调用commit("类型","值")传递过来的值
        state.sum -= value
    }
}

//定义一个state--用于存储数据
const state = {
    sum: 0,
}

//定义一个getters--用于将state中的数据进行加工
const getters = {
    bingSum(state) {
        return state.sum * 10
    }
}

//创建并使用默认暴露的方式暴露Vuex.Store的实例
export default new Vuex.Store({
    actions,
    mutations,
    getters,
    state
})
